<template>
  <el-table
    :data="tableData"
    border
    style="width: 100%"
  >
    <el-table-column
      label="名称"
      width="180"
    ><template v-slot="scope">
      <span style="font-weight: bold;">{{ scope.row.name }}</span>
    </template>
    </el-table-column>
    <el-table-column
      label="内容"
    ><template v-slot="scope">
      <el-checkbox v-model="scope.row.checked1">外观清洁；高压端对接正常；产品状态检查：</el-checkbox>
      <div>
        相间、对地（<el-input v-model="scope.row.v1" class="line-input" size="mini" />kV/1min）：
        <el-radio-group v-model="scope.row.checked2">
          <el-radio :label="true">合格</el-radio>
          <el-radio :label="false">不合格</el-radio>
        </el-radio-group>    （默认42）<br>
        断口（<el-input v-model="scope.row.v2" class="line-input" size="mini" />kV/1min）：
        <el-radio-group v-model="scope.row.checked3">
          <el-radio :label="true">合格</el-radio>
          <el-radio :label="false">不合格</el-radio>
        </el-radio-group>    （默认48）
      </div>
    </template>
    </el-table-column>
  </el-table>
</template>
<script>
/**
 * @Date: 2022/4/4
 */

export default {
  name: 'Question5',
  model: {
    prop: 'modelValue',
    event: 'change'
  },
  props: {
    modelValue: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      startWatchFlag: false,
      tableData: [{
        name: '耐压测试',
        v1: '',
        v2: '',
        checked1: false,
        checked2: false,
        checked3: false
      }]
    }
  },
  watch: {
    tableData: {
      handler(newVal, oldVal) {
        if (!this.startWatchFlag) return
        const nd = newVal[0]
        const rt = {}
        rt['v1'] = nd.v1
        rt['v2'] = nd.v2
        if (nd.checked1) {
          rt['check1'] = '√'
        } else {
          rt['check1'] = '□'
        }
        if (nd.checked2) {
          rt['check2_1'] = '√'
          rt['check2_2'] = '□'
        } else {
          rt['check2_1'] = '□'
          rt['check2_2'] = '√'
        }
        if (nd.checked3) {
          rt['check3_1'] = '√'
          rt['check3_2'] = '□'
        } else {
          rt['check3_1'] = '□'
          rt['check3_2'] = '√'
        }
        if (!nd.checked1 || nd.v1 === '' || nd.v2 === '') {
          rt.fe = '未填写完整'
        } else if ((!this.isNumber(nd.v1)) || (!this.isNumber(nd.v2))) {
          rt.fe = 'v1,v2应为数字类型'
        } else {
          rt.fe = ''
        }
        this.$emit('change', rt)
      },
      deep: true
    }
  },
  created() {
    if (Object.keys(this.modelValue).length === 0) {
      this.$emit('change', { 'v1': '', 'v2': '', 'check1': '□', 'check2_1': '□', 'check2_2': '□', 'check3_1': '□', 'check3_2': '□' })
    } else {
      const nd = this.tableData[0]
      nd.v1 = this.modelValue.v1
      nd.v2 = this.modelValue.v2
      if (this.modelValue.check1 === '√') {
        nd.checked1 = true
      }
      if (this.modelValue.check2_1 === '√') {
        nd.checked2 = true
      }
      if (this.modelValue.check3_1 === '√') {
        nd.checked3 = true
      }
      this.startWatchFlag = true
    }
  },
  methods: {
    isNumber(val) {
      return parseFloat(val).toString() !== "NaN"
      const regPos = /^\d+(\.\d+)?$/ // 非负浮点数
      const regNeg = /^(-(([0-9]+\.[0-9]*[1-9][0-9]*)|([0-9]*[1-9][0-9]*\.[0-9]+)|([0-9]*[1-9][0-9]*)))$/
      // 负浮点数
      if (regPos.test(val) && regNeg.test(val)) {
        console.log('fd')
        return true
      } else {
        console.log(123)
        return false
      }
    },
    print(x) {
      console.log(x)
    }
  }
}
</script>

<style lang="scss" scoped>
.line-input{
  margin: 0 4px;
  padding:0;
  width:72px;
  height:16px;
  line-height: 16px;
  border-radius: 0!important;
  ::v-deep > input{
    font-weight: bold;
    border-top: 0;
    border-right: 0;
    border-left: 0;
    font-size:12px;
    height:100%;
    line-height:100%;
    padding:0;
    border-radius: 0!important;
  }
}
</style>
